<template>
  <div class="pay"
       @click="handleChange">
    <div class="wechat">
      <i class="iconfont">&#xe67e;</i>
      微信支付
    </div>
    <div class="check"
         v-show="isCheck">
      <i class="iconfont">&#xe655;</i>
    </div>
  </div>
</template>
<script>
export default {
  name: 'CommonPay',
  props: {
    isCheck: Boolean
  },
  methods: {
    handleChange () {
      let flag = !this.isCheck
      this.$emit('changeIsCheck', flag)
    }
  }
}
</script>
<style lang="stylus" scoped>
@import '~stylus/variable.styl'
@import '~stylus/mixins.styl'

.pay
  width 100%
  height 96px
  background $common_bgc
  display flex
  align-items center
  justify-content space-between
  padding-left 32px
  padding-right 32px
  border-radius 24px
  box-sizing border-box

  .wechat
    font-size $address_name
    font-weight 400
    color $footer_bgc

    i
      font-size $me
      margin-right 25px
      color $wechat

  .check
    i
      font-size $delete
      color $wechat
</style>
